<!--
 * @Description: 图片预览
 * @Author: zhailei
 * @Date: 2021-01-18 15:17:26
 * @LastEditTime: 2021-08-03 17:28:03
 * 
 * @FilePath: \vite-demoe:\wwwroot\Vue\\-cloud-vue\src\components\TopVUI\custom\previewImage.vue
-->
<template>
  <t-modal
    :title="title"
    :width="width"
    :visible="visible"
    :footer="null"
    :maskClosable="maskClosable"
    :mask="mask"
    @cancel="
      () => {
        $emit('update:visible', false);
      }
    "
  >
    <img
      alt="example"
      style="width: 100%;margin: 20px 0;padding: 0 10px;"
      :src="imgSrc"
    />
  </t-modal>
</template>

<script>
export default {
  props: {
    visible: Boolean,
    imgSrc: String,
    title: {
      type: String,
      default: "图片预览",
    },
    maskClosable: {
      type: Boolean,
      default: false,
    },
    mask: {
      type: Boolean,
      default: true,
    },
    width: {
      type: Number,
      default: 640,
    },
  },
  data() {
    return {};
  },
};
</script>

<style scoped>
/deep/ .ant-modal-body {
  max-height: 90vh !important;
  overflow: auto !important;
}
</style>
